<!DOCTYPE html>
<html lang="en">
<head>
    <!--<meta http-equiv="Content-Type" content="text/html;charsetutf-8">-->
    <meta charset="UTF-8">
    <title>签到</title>
    <link rel="stylesheet" href="/common/util/layui/css/layui.css"  media="all">
</head>
<body>
<div class="demoTable" style="margin-left: 26%">
    人员信息:
    <div class="layui-inline">
        <input class="layui-input" name="id" id="demoReload" autocomplete="off">
    </div>
</div>

    <div style="margin-left: 26%">
        考勤情况:
        <div class="layui-inline">
        <select id="state" class="layui-select">
              <option value="">-请选择-</option>
              <option value="1">正常</option>
              <option value="3">迟到</option>
              <option value="4">缺勤</option>
              <option value="2" >早退</option>
           </select>
        </div>
    </div>

    <div style="margin-left: 26%">
        考勤日期:
        <div class="layui-inline">
        <input type="text" class="layui-input" id="test31" placeholder="yyyy-MM-dd">
        </div>
        <button class="layui-btn" data-type="reload" style="margin-left: 28%">查询</button>
        <button class="layui-btn layui-btn-primary" >考勤</button>
    </div>

 <div style="margin-left: 26%">
    <table class="layui-hide" id="test" lay-filter="test" >
    </table>
     <script type="text/html" id="toolbarDemo">
         <div class="layui-btn-container">
             <button class="layui-btn layui-btn-sm" lay-event="getCheckData">删除选中行</button>
         </div>
     </script>
 </div>

    <button class="layui-btn layui-btn-primary" style="margin-left: 46%">统计分析</button>

<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script src="/common/util/layui/layui.js" charset="utf-8"></script>
<script>
    layui.use('laydate', function() {
        var laydate = layui.laydate;
        //日期时间选择器
        laydate.render({
            elem: '#test31'
            ,theme: 'grid'
        });
    });
    layui.use('table', function(){
        var table = layui.table;
        table.render({
            elem: '#test'
            ,url:'/fy/attendance'
            ,method :'post'
            ,toolbar: '#toolbarDemo'
            ,title: '考勤表'
            ,totalRow: true
            ,width:870
            ,cols: [[
                {type: 'checkbox',fixed: 'left'}
                ,{field:'pno', title:'工号', width:161, sort: true}
                ,{field:'name', title:'姓名', width:162}
                ,{field:'entrytime', title:'入职时间', width:164, sort: true}
                ,{field:'state', title:'考勤情况', width:164}
                ,{field:'time', title:'考勤日期', width:164, sort: true}
            ]]
            ,id: 'testReload'
            ,page: true
        });

        //头工具栏事件
        table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case 'getCheckData':
                    var data = checkStatus.data;
                    layer.confirm('真的删除行么', function (index) {
                        $.ajax({
                            url: "/fy/addendanceDelete",
                            type: "POST",
                            data: {dat:JSON.stringify(data)},
                            success: function (msg) {
                                if(msg==200) {
                                    location.reload(true);
                                    //关闭弹框
                                    layer.close(index);
                                    layer.msg("删除成功", {icon: 6});
                                }else{
                                    layer.close(index);
                                    layer.msg("删除失败", {icon: 5});
                                }
                            }
                        });
                     });
                    break;
            }
        });

        var $ = layui.$, active = {
            reload: function(){
                var demoReload = $('#demoReload');
                var state=$('#state');
                var time=$('#test31');
                //执行重载
                table.reload('testReload', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    ,where: {
                            id: demoReload.val()
                            ,state:state.val()
                            ,time:time.val()
                    }
                });
            }
        };

        $('.layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });

    });
</script>

</body>
</html>